<extend name="Public/base_group_mobile" />
<block name="head">
	<link rel="stylesheet" href="__GROUPM__/css/global.css">
	<link rel="stylesheet" href="__GROUPM__/css/detail.css">
	<script type="x/template" id="modal-template">
        <div class="modal-mask" v-show="show" transition="modal">
            <div class="modal-wrapper">
                <div class="modal-container">
                    <div class="modal-header">
                        <slot name="header">
                        </slot>
                    </div>
                    
                    <div class="modal-body">
                        <slot name="body">
                        </slot>
                    </div>

                    <div class="modal-footer">
                        <slot name="footer">
                        </slot>
                    </div>
                </div>
            </div>
        </div>
	</script>
	<script type="x/template" id="share-template"></script>
</block>
<block name="header">
        <div class="u-share" v-show="showShare" style="display:none;" v-on:click="close_share">
            <img width="100%" src="__GROUPM__/img/提示.png">
        </div>

        <modal :show.sync="showModal"  style="display:none;">
            <div slot="header">
                <a v-on:click="close_modal" class="btn-close">关闭</a>
            </div>

            <div slot="body">
                <div class="row row-1">
                    <input maxlength="11" value=""  id="j-ipt-mobile" type="tel" name="" value="" placeholder="手机号">
                </div>
                <p class="tip">*请输入手机号</p>
                <div class="row row-2">
                    <input autocomplete="off" maxlength="6" id="j-ipt-code" type="tel" name="" value="" placeholder="验证码">
                    <button disabled class="btn-getcode btn-disabled" id="j-btn-getcode">获取验证码</button>
                </div>
                <p class="tip">*请输入验证码</p>
                <div class="row row-3">
                    <button id="j-btn-submit" class="submit">点击登陆</button>
                </div>                
            </div>
        </modal>
        <!-- 头部 -->
        <div class="g-hd">
            <div class="bar">
                <a class="btn-return" href="{:U('Shop/goodsGroup')}"></a>
                <span class="brand">宝贝详情</span>
                <a <neq name="list.but_status" value="0" >href="{:U('Customer/order')}"<else/>v-on:click="show_modal"</neq> class="btn-ucenter"></a>
            </div>
        </div>
        <!-- /头部 -->
</block>
<block name="content">
        <!-- 主体 -->
        <div class="g-bd">
            <div class="goods-pic">
            <eq name="list.shop_group_pic_id" value="0">
            	<img width="100%" src="__COMMON__/img/jjhh1-1.jpg">
            <else/>
                <img width="100%" src="{$list.shop_group_pic_id|getPictureThumb=###,414,414}">
            </eq> 
            </div>
            <div class="goods-info-base">
                <h4 class="title">{$list.goods_name}</h4>
                <div class="flex-box">
                    <div class="price">
                        <div class="now"><a>团购价: </a><a>￥</a><a>{$list.shop_group_price}</a></div>
                        <div class="before"><a>￥</a><a>{$list.market_price}</a></div>
                        <div class="store"><a>剩余 </a>{$list.shop_group_stock}户</div>
                    </div>
                </div>
            </div>

            <div class="goods-info-count">
              <span class="persons">团购人数</span>
              <span class="nums"><span id="group-buy">{$list.shop_group_customer_number}</span>人成团</span>
              <span class="now-num">本团队已有<span id="now-nums">{$list.shop_group_customer_num}</span>人</span>
            </div>

            <pre class="goods-info-addon">{$list.goods_introduction}</pre>

            <div class="goods-info-detail">
                <ul class="tab-header flex-box">
                    <li><a v-on:click="showTab(0)" v-bind:class="{active: 0 == tab_show}">商品详情</a></li>
                    <li><a v-on:click="showTab(1)" v-bind:class="{active: 1 == tab_show}">砍价攻略</a></li>
                    <li><a v-on:click="showTab(2)" v-bind:class="{active: 2 == tab_show}">活动规则</a></li>
                </ul>
                <ul class="tab-body">
                    <li v-show="0 == tab_show">{$list.goods_content}</li>
                    <li v-show="1 == tab_show"><img width="100%" src="__GROUPM__/img/砍价流程.jpg"></li>
                    <li v-show="2 == tab_show"><img width="100%" src="__GROUPM__/img/huodongguize.jpg"></li>
                </ul>
            </div>
        </div>
        <!-- /主体 -->

        <!-- 功能条 -->
        <div class="g-bottom flex-box">
            <a class="qq">
                定金：￥<span class="deposit">{$list.goods_deposit}</span>
            </a>
            <switch name="list.but_status">
				<case value="0"><a href="#" class="btn" v-on:click="show_modal"><if condition="I('team_id') eq 0">我要开团<else/>我要入团</if></a></case>
				<case value="1"><button onClick="goodsGroupOpen({$list.goods_id});return false;" class="btn">我要开团</button></case>
				<case value="2"><a class="btn btn-2">本团已满</a><button onClick="goodsGroupOpen({$list.goods_id});return false;" class="btn">我要开团</button></case>
				<case value="3"><button onClick="goodsGroupIn({$list.goods_id});return false;" class="btn">我要入团</button></case>
				<case value="4"><button onClick="goodsGroupBuy({$list.goods_id});return false;" class="btn">购买</button></case>
				<case value="5"><a href="#" class="btn" v-on:click="show_share">分享</a></case>
				<case value="6"><a class="btn btn-2">已购买</a></case>
				<case value="7"><a class="btn btn-2">售罄</a></case>
				<default/>等待
			</switch>
        </div>
        <!-- 功能条 -->	
		<script>
		var goods_info = {}
		var team_id = {$list.team_id};
		var API_SMS = "{:U('Customer/getSms')}";
        var API_LOGIN = "{:U('Customer/login')}";
		var open_url = "{:U('Shop/goodsGroupOpen')}";
		var in_url = "{:U('Shop/goodsGroupIn')}";
		var order_url = "{:U('Shop/goodsGroupBuy')}";
		var INDEX_URL = "{:U('Shop/goodsGroup')}";
		var IS_LOGIN = {$list.but_status};
		var url = "{:U('Shop/goodsGroupInfo',array('goods_id'=>$list['goods_id'],'team_id'=>$list['team_id']))}";
		history.pushState({}, '', url);
		
		</script>
		<script src="__STATIC__/zepto.min.js"></script>
	   	<script src="__STATIC__/echo-master/dist/echo.min.js"></script>
	   	<script src="__STATIC__/vue.js"></script>
</block>